<div class="box">
    <div class="box-header">
        <h3 class="box-title">VIP统计</h3>
    </div>
    <div class="box-body">
        <div class="row">
            <div class="col-md-3 col-sm-6 col-xs-12">
                <div class="info-box">
                    <span class="info-box-icon bg-aqua"><i class="fa fa-users"></i></span>
                    <div class="info-box-content">
                        <span class="info-box-text">总VIP用户</span>
                        <span class="info-box-number">{$stats.total_vip|default=0}</span>
                    </div>
                </div>
            </div>
            
            <div class="col-md-3 col-sm-6 col-xs-12">
                <div class="info-box">
                    <span class="info-box-icon bg-green"><i class="fa fa-money"></i></span>
                    <div class="info-box-content">
                        <span class="info-box-text">总收入</span>
                        <span class="info-box-number">¥{$stats.total_income|default=0}</span>
                    </div>
                </div>
            </div>
            
            <div class="col-md-3 col-sm-6 col-xs-12">
                <div class="info-box">
                    <span class="info-box-icon bg-yellow"><i class="fa fa-calendar"></i></span>
                    <div class="info-box-content">
                        <span class="info-box-text">本月新增</span>
                        <span class="info-box-number">{$stats.month_new|default=0}</span>
                    </div>
                </div>
            </div>
            
            <div class="col-md-3 col-sm-6 col-xs-12">
                <div class="info-box">
                    <span class="info-box-icon bg-red"><i class="fa fa-star"></i></span>
                    <div class="info-box-content">
                        <span class="info-box-text">活跃VIP</span>
                        <span class="info-box-number">{$stats.active_vip|default=0}</span>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="row">
            <div class="col-md-12">
                <div class="box">
                    <div class="box-header">
                        <h3 class="box-title">VIP套餐销售统计</h3>
                    </div>
                    <div class="box-body">
                        <table class="table table-bordered table-striped">
                            <thead>
                                <tr>
                                    <th>套餐名称</th>
                                    <th>销售数量</th>
                                    <th>销售金额</th>
                                    <th>占比</th>
                                </tr>
                            </thead>
                            <tbody>
                                {volist name="stats.package_stats" id="vo"}
                                <tr>
                                    <td>{$vo.name}</td>
                                    <td>{$vo.count}</td>
                                    <td>¥{$vo.amount}</td>
                                    <td>{$vo.percent}%</td>
                                </tr>
                                {/volist}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>